<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script>
import '@/assets/font/font.css'
export default {
  name: 'App'
}
</script>

<style>
/* 应用科技感主题的全局样式 */
#app {
  /* 自定义变量引用（确保在全局范围内可用） */
  --primary-blue: #6ab7ff;
  --neon-accent: #00f7ff;
  --bg-light: #f5f9ff;
  --dark-text: #2c3e50;
}

/* 确保所有页面内容区域使用背景色 */
.app-container, .el-main {
  background-color: var(--bg-light);
}

/* 默认为所有卡片应用科技感风格 */
.el-card {
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(106, 183, 255, 0.1) !important;
  margin-bottom: 20px;
  transition: all 0.3s ease;
  border: none !important;
}

.el-card:hover {
  box-shadow: 0 6px 16px rgba(106, 183, 255, 0.15) !important;
}

/* 全局霓虹图标效果 */
.el-icon-reading, 
.el-icon-notebook-2,
.el-icon-user-solid,
.el-icon-document-checked,
.el-icon-trophy,
.el-icon-pie-chart,
.el-icon-alarm-clock,
.el-icon-megaphone {
  color: var(--neon-accent);
  text-shadow: 0 0 8px rgba(0, 247, 255, 0.3);
}
</style>
